/**
 * Created by Administrator on 2017/3/14.
 */
var SelectDropDown = require('../../../src/libs/select-drop-down');
var DatePicker = require('../../../src/libs/date-picker');
var Progress = require('../../../src/libs/progress');
var RealName = require('../../src/complex/realName');
var DatePickerSearch = require('../complex/datePickerSearch');
var FinanceRecord = require('../complex/financeRecord');
var Pagination = require('../../../src/libs/pagination');
var Root = React.createClass({
    getInitialState: function () {
        return{
            realName: PageDM.realNameInfo.value,
            investRecord: PageDM.investRecord.value,
            stautsOption: PageDM.stautsOption.value.options,
            pageVal: PageDM.pagination.value
        }
    },
    componentDidMount: function(){
        var _this = this;
        var PageDM = window.PageDM;

        UEventHub.on(PageDM.investRecord.dmbind + UI_EVENT_CONST.SET_UDM_VALUE_EVENT, function(v){
            _this.updateInvestRecordHandler(v);
        });
        UEventHub.on(PageDM.datePickerSearch.dmbind + UI_EVENT_CONST.SET_UDM_VALUE_EVENT, function(v){

        });
        UEventHub.on(PageDM.stautsOption.dmbind + UI_EVENT_CONST.SET_UDM_VALUE_EVENT, function(v){
            // console.log(_this.refs.stautsOption.getCurrentSelect());
            console.log(v)
            _this.updateInvestRecordHandler(v);
        });
        //个人实名信息
        UEventHub.on(PageDM.realNameInfo.dmbind + UI_EVENT_CONST.SET_UDM_VALUE_EVENT, function(v){

            _this.updateRealNameInfoHandler(v);
        });
        UEventHub.on(PageDM.pagination.dmbind + UI_EVENT_CONST.SET_UDM_VALUE_EVENT, function(v){
            _this.setState({
                pageVal: v
            });
        });
        var stausSelect = _this.refs.stautsOption.getCurrentSelect();
        PageDM.stautsOption.setValue(stausSelect);
        PageDM.stautsOption.getCurrentSelect = function () {
            return _this.refs.stautsOption.getCurrentSelect();
        };
        UEventHub.emit("pageLoad","hello world!");
    },
    DatePickerChange: function (start,end) {
        PageDM.datePickerSearch.setValue({startTime:start,endTime:end});
        PageDM.datePickerSearch.onChange(start,end);
    },
    searchChange: function (v) {
        PageDM.stautsOption.setValue(v);
        PageDM.stautsOption.onChange(v);
    },
    pageClick:function (v) {
        PageDM.pagination.setValue({curPage:v});
        PageDM.pagination.onClick(v);
    },
    updateRealNameInfoHandler: function (v) {
        this.setState({
            realName:v
        })
    },
    updateInvestRecordHandler: function (v) {
        this.setState({
            investRecord:v
        })
    },
    render: function () {
        var _this = this;
        var PageDM = window.PageDM;
        var investRecordDom = [];

        if(this.state.investRecord.list.length > 0){
            investRecordDom.push(<FinanceRecord data={this.state.investRecord.list}/>)
        }else {
            if(this.state.investRecord.noPrecedent == -1){
                investRecordDom.push('')
            }else if(this.state.investRecord.noPrecedent){
                investRecordDom.push(
                    <div className="nodata">
                        <i className="bg-3"></i>您还没有在本平台成功融资过，如果有需要，现在前往 <a href={PageDM.investRecord.goFinanceUrl} className="fc-link"> 我要借款</a> 进入融资流程！
                    </div>
                )
            }else{
                investRecordDom.push(
                    <div className="nodata">
                        <i className="bg-1"></i>暂无融资记录
                    </div>
                )
            }
        }

        return (
            <div>

                <div className="mod-account container">
                    <div className="sub-nav" ref="realName">
                        <RealName data={this.state.realName}/>
                    </div>
                    <div className="account">
                        <div className="record-select">
                            <div className="title-account"><span>融资记录</span></div>
                            <div className="select clearfix">
                                <DatePickerSearch {...PageDM.datePickerSearch.value} onChange={this.DatePickerChange} />
                                <SelectDropDown ref="stautsOption" className="drapdown" defaultValue={PageDM.stautsOption.value.selectValue} defaultIndex={PageDM.stautsOption.value.selectIndex}  options={this.state.stautsOption} onChange={_this.searchChange}/>

                            </div>
                        </div>
                        <div className="investment-record financing" ref="investRecord">
                            {investRecordDom}
                        </div>
                        <Pagination  pageVal={_this.state.pageVal} onClick={this.pageClick}></Pagination>
                    </div>
                    <div className="clear"></div>

                </div>
            </div>
        )
    }
});
ReactDOM.render(<Root/>, document.getElementById('giraffe'));